iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 14
1

input 這個標籤其實很萬用,在網頁中一定會看到他的蹤影。
不管事搭配form表單還是直接搭配JS使用
在這列出input的type

按鈕:

button:一個可單擊的按鈕(常跟JS做搭配)

submit:一個提交按鈕(將所有表單值提交給表單處理程序)

image:一個圖形按鈕

reset:重置按鈕,能夠重置表單內容

選擇:

checkbox:複選框只要是type是checkbox就是一組,根據form表單的不同也能分為多組

radio:單選框,單選組必須具有相同的名稱(名稱屬性的值),才能被視為一個組,即是屬性name的內容要一樣

日期:

date:日期選擇器,包含年,月,日

datetime-local:日期選擇器,包含年,月,日,時間

輸入:

email:就很單純的定義一個電子郵件地址的字段,不過它會自動檢查,確保格式正確的電子郵件

file:文件選擇字段和用於文件上傳的"瀏覽"按鈕,允許選擇多個文件的文件選擇字段,要添加multiple屬性
要限制格式就增加accept屬性但是這個屬性只能跟file一起使用

hidden:一個隱藏的輸入字段

number:用於輸入數字的字段
以下屬性能限制
max :允許的最大值
min :允許的最小值
step :指定合法編號間隔,如果step ="2",則合法數字可以是-4,-2,0,2,4等
value :指定默認值

password:密碼字段(字符被遮蔽)

tel:用於輸入電話號碼的字段,它會自動檢查,確保格式正確,能用pattern去限制輸入格式。
例如:pattern="[0]{1}[9]{1}[0-9]{8}" 這樣代表開頭0的一個,9的一個,0-9的8個

text:單行文本字段


上一篇
DAY13-JS事件
下一篇
DAY15-字串切割
系列文
30天資料整理30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言